<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head><title>换管 - 维修记录 - 其它缺陷管理</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/js/plugin/datetimepicker/jquery.datetimepicker.min.css"></head>
<body>
    <input type="hidden" id="JQ_defectId" value="${defectId}">
    <input type="hidden" id="JQ_gisid" value="${gisId}">
    <input type="hidden" id="JQ_noninternal_save_path" value="pipeWeld">
    <!-- content-body -->
    <div class="main-inner">
        <div class="content-inner">
            <form id="JQ_step01_form">
            <div id="JQ_step_01">
                <div class="meta-head">
                    <h3><i class="zy-tongji-icon"></i>其它缺陷管理 <i class="zy-url-arrow"></i> 维修记录 <i class="zy-url-arrow"></i> 换管</h3>
                </div>
                <div class="zy-form-line"><hr></div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>起点坐标(x)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_startX" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:4,title:'起点坐标(x)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>起点坐标(y)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_startY" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:4,title:'起点坐标(y)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>起点坐标(z)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_startZ" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:4,title:'起点坐标(z)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>终点坐标(x)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_endX" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:4,title:'终点坐标(x)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>终点坐标(y)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_endY" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:4,title:'终点坐标(y)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>终点坐标(z)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_endZ" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:4,title:'终点坐标(z)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>起始里程(m)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_startMileage" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:3,title:'起始里程(m)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>终点里程(m)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_endMileage" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:3,title:'终点里程(m)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>换管长度(m)</div>
                        <div class="zy-input-inner">
                            <input id="JQ_lenth" type="text" class="zy-i-input zy-verify" data-verify="{required:true,type:'number',round:3,title:'换管长度(m)'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta">材质类型</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_material_a" class="bk-select"></blockquote>
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>材质</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_material_b" class="bk-select zy-verify" data-verify="{required:true,title:'材质'}"></blockquote>
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>制管方式</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_manuPipeType" class="bk-select zy-verify" data-verify="{required:true,title:'制管方式'}"></blockquote>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>管径</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_diameter" class="bk-select zy-verify" data-verify="{required:true,title:'管径'}"></blockquote>
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>壁厚</div>
                        <div class="zy-input-inner">
                            <input id="JQ_wallThickness" type="text" class="zy-i-input zy-verify w-90" data-verify="{required:true,type:'number',round:1,title:'壁厚'}" autocomplete="off">
                            <label class="zy-i-label w-10">mm</label>
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>防腐层材料</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_coatingMaterial" class="bk-select zy-verify" data-verify="{required:true,title:'防腐层材料'}"></blockquote>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>防腐等级</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_coatingGrade" class="bk-select zy-verify" data-verify="{required:true,title:'防腐等级'}"></blockquote>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-65">
                        <div class="zy-input-meta">备注</div>
                        <div class="zy-textarea-inner">
                            <textarea id="JQ_createRemark" class="zy-textarea w-100" autocomplete="off"></textarea>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>

                <!-- repairBeforeImage -->
                <div class="zy-form-line">
                    <div class="zy-input-group w-100">
                        <div class="zy-input-meta">照片</div>
                        <div class="zy-picture-inner">
                            <div class="zy-picture-line">
                                <span class="zy-pic-title">修复前：</span>
                                <label class="zy-noninternal-upload-label"></label>
                                <button class="zy-noninternal-upload-button" type="button" data-type="REPAIR_BEFORE" data-tag="imgsReplace" title="添加照片" data-count="0">+</button>
                            </div>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <!-- repairInImage -->
                <div class="zy-form-line">
                    <div class="zy-input-group w-100">
                        <div class="zy-picture-inner">
                            <div class="zy-picture-line">
                                <span class="zy-pic-title">修复中：</span>
                                <label class="zy-noninternal-upload-label"></label>
                                <button class="zy-noninternal-upload-button" type="button" data-type="REPAIR_DURING" data-tag="imgsReplace" title="添加照片" data-count="0">+</button>
                            </div>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <!-- repairAfterImage -->
                <div class="zy-form-line">
                    <div class="zy-input-group w-100">
                        <div class="zy-picture-inner">
                            <div class="zy-picture-line">
                                <span class="zy-pic-title">修复后：</span>
                                <label class="zy-noninternal-upload-label"></label>
                                <button class="zy-noninternal-upload-button" type="button" data-type="REPAIR_AFTER" data-tag="imgsReplace" title="添加照片" data-count="0">+</button>
                            </div>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>

                <!-- submit-button -->
                <div class="zy-wind-line t-r">
                    <br>
                    <br>
                    <button class="zy-button zy-submit" type="button" id="JQ_noninternal_change_pipe_gonext_btn"><i class="zy-submit-icon"></i>下一步</button>&nbsp;&nbsp;&nbsp;&nbsp;
                    <button class="zy-button zy-goback" type="button" id="JQ_noninternal_change_piep_goback_btn"><i class="zy-goback-icon"></i>返回</button>
                </div>
            </div>
            </form>
            <form id="JQ_create_form">
            <div id="JQ_step_02" class="hidden">
                <div class="meta-head">
                    <h3>
                        <i class="zy-tongji-icon"></i>非内检缺陷管理 <i class="zy-url-arrow"></i> 维修记录 <i class="zy-url-arrow"></i> 换管 <i class="zy-url-arrow"></i> 焊接
                        <span class="r"><button type="button" class="zy-button-s zy-create-s" id="JQ_add_pipe_weld"><i class="zy-create-icon"></i>添加环焊缝</button></span>
                    </h3>
                </div>
                <div class="zy-form-line">
                    <hr>
                </div>
                <div class="zy-form-line">
                    <div class="zy-form-line">环焊缝</div>
                    <div class="zy-form-line">
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>环焊缝编号</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-number zy-verify" data-verify="{required:true,title:'环焊缝编号'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(X)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-x zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(X)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(Y)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-y zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(Y)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(Z)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-z zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(Z)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-form-line">环焊缝</div>
                    <div class="zy-form-line">
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>环焊缝编号</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-number zy-verify" data-verify="{required:true,title:'环焊缝编号'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(X)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-x zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(X)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(Y)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-y zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(Y)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(Z)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input gww-z zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(Z)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="zy-form-line zy-pipe-weld-third hidden">
                    <div class="zy-form-line">
                        <span class="l">环焊缝</span>
                        <span class="r"><button type="button" class="zy-button-s zy-delete-s" id="JQ_pipe_weld_third_delete"><i class="zy-delete-icon"></i>删除</button></span>
                        <div class="clear"></div>
                    </div>
                    <div class="zy-form-line">
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>环焊缝编号</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input non gww-number zy-verify" data-verify="{required:true,title:'环焊缝编号'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(X)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input non gww-x zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(X)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(Y)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input non gww-y zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(Y)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="zy-sp"></div>
                        <div class="zy-input-group w-22">
                            <div class="zy-input-meta"><i class="zy-requird-icon"></i>采集坐标(Z)</div>
                            <div class="zy-input-inner">
                                <input type="text" class="zy-i-input non gww-z zy-verify" data-verify="{required:true,type:'number',round:4,title:'采集坐标(Z)'}" autocomplete="off">
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>WPS编号</div>
                        <div class="zy-input-inner">
                            <input id="JQ_wpsNumber" type="text" class="zy-i-input zy-verify" data-verify="{required:true,title:'WPS编号'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>无损检测类型</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_ndtType" class="bk-select zy-verify" data-verify="{required:true,title:'WPS编号'}"></blockquote>
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>是否返修</div>
                        <div class="zy-select-inner">
                            <blockquote id="JQ_repairind" class="bk-select zy-verify" data-verify="{required:true,title:'是否返修'}">
                                <abbr></abbr>
                            </blockquote>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>焊接材料</div>
                        <div class="zy-input-inner">
                            <input id="JQ_weldingMaterial" type="text" class="zy-i-input zy-verify" data-verify="{required:true,title:'焊接材料'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>检测日期</div>
                        <div class="zy-input-inner">
                            <input id="JQ_testDate_input" type="text" class="zy-i-input zy-i-input-date zy-verify" data-verify="{required:true,title:'检测日期'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="zy-sp"></div>
                    <div class="zy-input-group w-31">
                        <div class="zy-input-meta"><i class="zy-requird-icon"></i>检测单位</div>
                        <div class="zy-input-inner">
                            <input id="JQ_testingCompany" type="text" class="zy-i-input zy-verify" data-verify="{required:true,title:'检测单位'}" autocomplete="off">
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-65">
                        <div class="zy-input-meta">备注</div>
                        <div class="zy-textarea-inner">
                            <textarea id="JQ_createRemark_weldingRemark_01" class="zy-textarea w-100" autocomplete="off"></textarea>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="zy-form-line">
                    <div class="zy-input-group w-100">
                        <div class="zy-input-meta">照片</div>
                        <div class="zy-picture-inner">
                            <div class="zy-picture-line">
                                <span class="zy-pic-title">拍照上传：</span>
                                <label class="zy-noninternal-upload-label"></label>
                                <button class="zy-noninternal-upload-button" type="button" data-type="ALL" data-tag="imgsWelding" title="添加照片" data-count="0">+</button>
                            </div>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <!-- submit-button -->
                <div class="zy-wind-line t-r">
                    <button class="zy-button zy-submit" type="button" id="JQ_noninternal_submit_btn"><i class="zy-submit-icon"></i>提交</button>&nbsp;&nbsp;&nbsp;&nbsp;
                    <button class="zy-button zy-goback" type="button" id="JQ_noninternal_pipe_weld_back"><i class="zy-goback-icon"></i>返回</button>
                </div>
            </div>
            </form>
        </div>
    </div>
    <!-- gis service address -->
    <input id="JQ_gis_service" name="gis_service" value="${gisServicePath}" type="hidden">
    <!-- plugin -->
    <script src="${pageContext.request.contextPath}/static/js/plugin/datetimepicker/jquery.datetimepicker.full.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/plugin/plupload/plupload.full.min.js"></script>
    <!-- ui -->
    <script src="${pageContext.request.contextPath}/static/js/ui/ui-main.js"></script>
    <!-- base -->
    <script src="${pageContext.request.contextPath}/static/js/controller/base/base.controller.js"></script>
    <!-- api -->
    <script src="${pageContext.request.contextPath}/static/js/controller/api/defect.api.js"></script>
    <!-- controller -->
    <script src="${pageContext.request.contextPath}/static/js/controller/defect/noninternal/noninternalRepairRecord.controller.js"></script>
    <!-- gis js -->
    <script src="${gisApiPath}"></script>
    <script type="text/javascript">
        require([
            "esri/tasks/query", "esri/tasks/QueryTask",
            "dojo/domReady!"
        ], function (Query, QueryTask) {
            /*
             1、首先去获取该点所在管线的PIPE_LINE_ID，
             2、PIC_PIPE_MAP_CENTER_LINE表中查找对应管道ID的gisID
             3、获取该点的X坐标
             4、获取该点的Y坐标
             */
            function getMileage(lineGisId, ptX, ptY, tag) {
                esri.config.defaults.io.proxyUrl = "${gisResourcePath}/proxy.jsp";
                esri.config.defaults.io.alwaysUseProxy = true;
                //管道中心线服务
                var url = document.getElementById('JQ_gis_service').value;
                //var url = "http://192.168.2.56:6080/arcgis/rest/services/pxs/dypipeline/MapServer/26";//可配置
                var query = new esri.tasks.Query();
                query.where = "ID_='" + lineGisId + "'";
                query.returnGeometry = true;
                query.outFields = ["*"];
                var queryTask = new esri.tasks.QueryTask(url);
                queryTask.execute(query, function (graphics) {
                    var mileage = 0;
                    var date1 = new Date();
                    if (graphics.features.length > 0) {
                        var polyline = graphics.features[0].geometry;
                        var linePath = polyline.paths[0];
                        var segementsInfo = [];
                        var pt = [ptX, ptY];
                        var nearestDist = -1;   //记录距离线段最近的距离
                        var nearestInfo;//记录记录线段最近点的信息，包括坐标信息、到线上最近的点、线上最近的点距离所在线段起点的距离
                        var minIndex = 0;
                        for (var i = 0; i < linePath.length - 1; i++) {
                            var tmpJson = queryNearestPt(pt, linePath[i], linePath[i + 1]);
                            if (0 == i) {
                                nearestDist = tmpJson.minDistance;
                                nearestInfo = tmpJson;
                            }
                            segementsInfo.push(tmpJson);
                            if (nearestDist > tmpJson.minDistance) {
                                nearestDist = tmpJson.minDistance;
                                nearestInfo = tmpJson;
                                minIndex = i;
                            }
                        }
                        for (var j = 0; j < minIndex; j++) {
                            mileage = mileage + getLength(linePath[j], linePath[j + 1]);
                        }
                        //mileage = mileage + nearestInfo.minDistance;
                        mileage = mileage + nearestInfo.sgMileage;
                    } else {
                        mileage = 0;  //等于0的情况，说明数据库中不存在该管道中心线或查询出错。
                    }
                    var date2 = new Date();
                    var t = Math.floor((date2 - date1) / 1000);
                    if(tag == 'start'){
                        document.getElementById('JQ_startMileage').value = mileage.toFixed(3);
                    }else if(tag == 'end'){
                        document.getElementById('JQ_endMileage').value = mileage.toFixed(3);
                    }
                }, function (error) {
                    //console.log("查询出错，请稍后重试！");
                    //console.log(error);
                    mileage = 0;
                });
            }

            //把点放到线上。
            //求点到线段上最近点。
            function queryNearestPt(point, linePoint1, linePoint2) {
                var pt = [];
                var arryX = [linePoint1[0], linePoint2[0]];
                var arryY = [linePoint1[1], linePoint2[1]];
                var minX = getMinValue(arryX);
                var maxX = getMaxValue(arryX);
                var minY = getMinValue(arryY);
                var maxY = getMaxValue(arryY);
                //斜率为不存在的情况
                if (linePoint1[0] == linePoint2[0]) {
                    var tmpX = linePoint1[0];
                    var tmpY;
                    if (point[1] >= minY && point[1] <= maxY) {
                        tmpY = point[1];
                    } else if (point[1] < minY) {
                        tmpY = minY;
                    } else if (point[1] > maxY) {
                        tmpY = maxY;
                    }

                    var pt = [tmpX, tmpY];
                } else {
                    //斜率
                    var k = Math.abs((linePoint2[1] - linePoint1[1])
                            / (linePoint2[0] - linePoint1[0]));

                    if (k == 0) {
                        //斜率为0
                        var x = minX;
                        if (point[0] >= minX && point[0] <= maxX) {
                            x = point[0];
                        } else if (point[0] < minX) {
                            x = minX;
                        } else if (point[0] > maxX) {
                            x = maxX;
                        }
                        var y = linePoint1[1];
                        pt = [x, y];
                    } else {
                        var x = (k * linePoint1[0] + point[0] / k + point[1] - linePoint1[1])
                                / (1 / k + k);
                        var y = -1 / k * (x - point[0]) + point[1];
                        if (minX < x && point[0] < maxX && minY < y && y < maxY) {
                            //如果点在线段上
                            pt = [x, y];
                        } else {
                            //找到距离xy最近的端点
                            var length1 = getLength(point, linePoint1);
                            var length2 = getLength(point, linePoint2);

                            if (length1 > length2) {
                                pt = linePoint2;
                            } else {
                                pt = linePoint1;
                            }
                        }
                    }
                }

                var length = getLength(point, pt);
                var sgMileage = getLength(linePoint1, pt);//距离该线段的距离
                var resJson = {
                    minDistance: length,//点到线的最短距离
                    nearestPt: pt, //到线段上最近的点
                    sgMileage: sgMileage, //距离该点段起点的距离
                    lineStartPt: linePoint1//该线段起点的坐标。
                };
                return resJson;
            }

            //求两点距离
            function getLength(point1, point2) {
                var xdiff = (point2[0] - point1[0]);
                var ydiff = (point2[1] - point1[1]);

                return Math.pow((xdiff * xdiff + ydiff * ydiff), 0.5);
            }

            //获取数组最小值
            function getMinValue(values) {
                var minValue = 999999999999999;
                for (var i = 0; i < values.length; i++) {
                    if (values[i] < minValue)
                        minValue = values[i];
                }

                return minValue;
            }

            //获取数组最大值
            function getMaxValue(values) {
                var maxValue = -999999999999999;
                for (var i = 0; i < values.length; i++) {
                    if (values[i] > maxValue)
                        maxValue = values[i];
                }
                return maxValue;
            }

            // 获得GIS id
            function getGISID(x,y,tag){
                var v1 = x.val();
                var v2 = y.val();
                if(v1 && v2){
                    var gisid = $('#JQ_gisid').val();
                    if(gisid){
                        getMileage(gisid, v1, v2, tag);
                        changeLen();
                    }
                }
            }

            // 起始 x 坐标
            $('#JQ_startX').keyup(function(){
                var v1 = $.trim($(this).val());
                if(v1 && $.isNumeric(v1)){
                    getGISID($('#JQ_startX'),$('#JQ_startY'),'start');
                }else{
                    $(this).TIP({
                        content: 'x应为数字！'
                    });
                }
            });

            // 起始 y 坐标
            $('#JQ_startY').keyup(function(){
                var v1 = $.trim($(this).val());
                if(v1 && $.isNumeric(v1)){
                    getGISID($('#JQ_startX'),$('#JQ_startY'),'start');
                }else{
                    $(this).TIP({
                        content: 'y应为数字！'
                    });
                }
            });

            // 终点 x 坐标
            $('#JQ_endX').keyup(function(){
                var v1 = $.trim($(this).val());
                if(v1 && $.isNumeric(v1)){
                    getGISID($('#JQ_endX'),$('#JQ_endY'),'end');
                }else{
                    $(this).TIP({
                        content: 'x应为数字！'
                    });
                }
            });

            // 终点 y 坐标
            $('#JQ_endY').keyup(function(){
                var v1 = $.trim($(this).val());
                if(v1 && $.isNumeric(v1)){
                    getGISID($('#JQ_endX'),$('#JQ_endY'),'end');
                }else{
                    $(this).TIP({
                        content: 'y应为数字！'
                    });
                }
            });

            // 换管长度(m)
            function changeLen(){
                var v1 = $('#JQ_startMileage').val();
                var v2 = $('#JQ_endMileage').val();
                if(v2 > v1){
                    var temp = v2 - v1;
                    $('#JQ_lenth').val(temp);
                }
            }

        });

    </script>
</body>
</html>
